import { Button } from 'antd-mobile'
import './index.scss'
import Icon from '@/components/icon/index'
function Test() {
  console.log(123)
  return (
    <div>
      <h1>Test</h1>
      <Button>Default Button</Button>
      <Button color="success">success</Button>
      {/* 测试原生css变量 */}

      <div className="vcss">
        123
        <p className="mainColor">css变量</p>
      </div>
      <p className="txt">456</p>
      {/* 测试自适应 */}
      <div className="box">789</div>
      {/* 注意：内联的样式改不了 */}
      <p style={{ fontSize: '30px' }}>内联不能进行适配</p>
      {/* 移动端1pxbug */}
      <div className="one">
        <div className="top"></div>
        <div className="btm"></div>
      </div>
      {/* 测试图标 */}
      <div className="i">
        {/* 没有封装的，很复杂 */}
        <svg className="icon" aria-hidden="true">
          {/* 使用时，只需要将此处的 iconbtn_like_sel 替换为 icon 的名称即可*/}
          <use xlinkHref="#iconbtn_like_sel"></use>
        </svg>
        {/* 封装了的 */}
        <div>
          <Icon
            onClick={() => {
              console.log('点击图标')
            }}
            type="iconbtn_like_sel"
            className="bicon"></Icon>
          <Icon type="iconbtn_mine_sel"></Icon>
        </div>
      </div>
    </div>
  )
}

export default Test
